<!DOCTYPE html>
<html>
	<head>
		<meta charset="UTF-8">
		<title>商品详情</title>
		<link rel="shortcut icon" href="images/cont/icon.png" />
		<link rel="stylesheet" type="text/css" href="css/jquery-ui.css"/>
		<link rel="stylesheet" type="text/css" href="css/font-awesome.css"/>
		<link rel="stylesheet" type="text/css" href="css/tradeDetail.css"/>
	</head>
	<body>
		<nav id="hnav">
			<div id="mdiv">
				<div id="div1">
					<p class="red"><a href="#"><img id="home-icon" src="images/cont/HOME.png"/>美逊商城</a></p>
					<p><span>您好，欢迎来到美逊商城</span></p>
					<p class="red"><a href="#">请登录</a></p>
					<p class="red"><a href="#">免费注册</a></p>
				</div>
				<div id="div2">
					<div class="sel">
						<p>站点导航</p>
						<ul>
							<li>品牌</li>
						</ul>
					</div>
					<div class="sel">
						<p> 客户服务 </p>
						<ul>
							<li>帮助中心</li>
							<li>售后服务</li>
						</ul>
					</div>
					<div class="sel">
						<p> 我的收藏 </p>
						<ul>
							<li>商品收藏</li>
							<li>店铺收藏</li>
						</ul>
					</div>
					<div class="sel">
						<p> 我是买家 </p>
						<ul>
							<li>我的订单</li>
							<li>待付款订单</li>
							<li>待确认收货</li>
							<li>待评价交易</li>
						</ul>
					</div>
					<div class="sel">
						<p> 我是卖家 </p>
						<ul>
							<li>卖家中心</li>
							<li>实物交易</li>
							<li>商品发布</li>
							<li>店铺设置</li>
						</ul>
					</div>
					<div class="sel">
						<p><a href="#"> 购物车 </a></p>
					</div>
				</div>
				<div class="clear-float"></div>
				
			</div>
		</nav>
		
		<header>
			<div id="logo">
				<img id="logo-img" src="images/cont/logo.jpg" />
			</div>
			
			<div id="youyou">
				<a id="yousun">优优阳光</a>
				<br />
				<img src="images/cont/pa.jpg"/>
			</div>
			
			<div id="search-div">
				<div id="search-box">
					<aside id="abox">
						<input type="text" id="abinput" placeholder="请输入您要搜索的关键字"/>
						<div id="seatext">搜全站</div>
						<div id="seadiv">搜本站</div>
					</aside>
					
					<div id="search-list">
						<p class="em-text">中性笔</p>
						<p class="em-text">复印纸</p>
						<p class="em-text">硒鼓</p>
						<p class="em-text">档案盒</p>
						<p class="em-text">验钞机</p>
						<p class="em-text">打印机</p>
					</div>
				</div>
			</div>
		</header>
		<hr class="hr"/>
		<img id="afnav-img" src="images/cont/logo-top.gif"  />
		
		<nav id="mnav">
			<div id="mnav-list">
				<p class="mnavp">店铺首页</p>
				<p class="mnavp">全部商品</p>
				<p class="mnavp">复印纸</p>
				<p class="mnavp">办公用品</p>
				<p class="mnavp">热门耗材</p>
				<p class="mnavp">生活日用</p>
				<p class="mnavp">打印一体机热销</p>
				<p class="mnavp">电脑热销</p>
				<p class="mnavp">外设附件</p>
				<p class="mnavp">清仓专区</p>
				<p class="clear-float"></p>
			</div>
			
		</nav>
		
		<main> 
			<p id="main-p">
				<span class="pspan">首页></span>
				<span class="pspan">电脑办公></span>
				<span class="pspan">办公设备></span>
				<span class="pspan">打印机></span>
				<span class="pspan">佳能（Canon）iP2780 彩色喷墨打印机></span>
			</p>
			<section id="m-sec">
				<div id="sec-img">
					<img id="currentImg" src="images/cont/thumb1.jpg" />  
				 	<div id="draggable3" class="draggable ui-widget-content">
					    <p></p>
					</div>
				</div>
				
				<div id="big-img">
					<img id="bImg" src=""  />
				</div>
				
				<div id="detail">
					<section id="trade-name">
						<div>佳能（Canon）iP2780 彩色喷墨打印机</div>
						<aside>买就送，价值 29元 得力USB风扇一台</aside>	
					</section>
					<section id="trade-price">
						<div>市 场 价：<span class="delete-price">¥429.60</span></div>
						<div>商 城 价：<span class="current-price"> ¥349.00</span></div>
					</section>
					<section id="market-search">
						<div class="marsea">销量：<span class="red-num">7</span></div>
						<div class="marsea">累计评价：<span class="red-num">0</span></div>
						<div>商品评价：
							<img src="image/cont/star-on.png" alt="" />
							<img src="image/cont/star-on.png" alt="" />
							<img src="image/cont/star-on.png" alt="" />
							<img src="image/cont/star-on.png" alt="" />
							<img src="image/cont/star-on.png" alt="" />
						</div>
					</section>
					<section id="emption">
						<aside id="surplus">
							<span id="buy-num">购买数量：<input type="text" id="buy-input"/>  (当前库存 9992 件) </span>
						</aside>
						<aside id="put-button">
							<button id="buy-goods">&nbsp;立即购买&nbsp;</button>
							<button id="add-goods"><span class="icon-shopping-cart"></span>添加购物车</button>
						</aside>
						<aside id="free">
							<div>免单额度：<span class="icon-gift"> 满39免运费</span></div>
						</aside>
						<aside id="share">
							
						</aside>
						<div id="tips">
							<div id="close"><span class="icon-remove-sign"></span></div>
							<div>成功添加到购物车</div>
							<div>购物车共有<span id="goods-num">0</span>件商品&emsp;总价为：<span id="all-price">￥349.00</span></div>
							<div>
								<button id="search-gouwuche" class="to-search">
									查看购物车
								</button>
								<button id="continue" class="to-search">
									继续购物
								</button>
							</div>
						</div>
					</section>
				</div>
				
				<aside id="datailimg-list">
					<div id="pro"><span class=" icon-caret-left"></span></div>
					<img src="images/cont/thumb1.jpg" class="trade-img pointer" />
					<img src="images/cont/thumb2.jpg" class="trade-img" />
					<img src="images/cont/thumb3.jpg" class="trade-img" />
					<img src="images/cont/thumb4.jpg" class="trade-img" />
					<div id="next"><span class=" icon-caret-right"></span></div>
				</aside>
			</section>
			
		</main>
		
		<hr class="hr"/>
		
		<div id="last-footer">
			
			<img src="images/cont/mz_home.jpg" alt="" />
			<hr class="hr" />
			
			<section id="footer-nav">
				<div class="fn-list">
					<aside class="fn-tit">帮助中心</aside>
					<p class="fn-name">购物流程 </p>
					<p class="fn-name">查看已购买商品 </p>
					<p class="fn-name">会员等级 </p>
					<p class="fn-name">忘记密码 </p>
					<p class="fn-name">交易须知 </p>
				</div>
				<div class="fn-list">
					<aside class="fn-tit">支付方式</aside>
					<p class="fn-name">发票保障  </p>
					<p class="fn-name">在线支付 </p>
					<p class="fn-name">会员等级 </p>
				</div>
				<div class="fn-list">
					<aside class="fn-tit">售后服务</aside>
					<p class="fn-name">退换货政策</p>
					<p class="fn-name">联系卖家</p>
					<p class="fn-name">退款申请  </p>
				</div>
				<div class="fn-list">
					<aside class="fn-tit">关于我们</aside>
					<p class="fn-name">联系我们 </p>
					<p class="fn-name">关于我们 </p>
					<p class="fn-name">招聘英才 </p>
				</div>
				<div class="fn-list">
					<aside class="fn-tit">商家服务</aside>
					<p class="fn-name">入驻协议  </p>
					<p class="fn-name">入驻标准 </p>
					<p class="fn-name">入驻资费  </p>
					<p class="fn-name">商家中心  </p>
					<p class="fn-name">商家入驻 </p>
				</div>
				<div class="fn-list">
					<aside class="fn-tit">客服中心</aside>
				</div>
			</section>
		</div>	
		
		<footer id="footer">
			<div id="footer-first">
				<p class="first-name">首页</p>
				<p class="first-name">招聘英才</p>
				<p class="first-name">招聘英才</p>
				<p class="first-name">联系我们</p>
				<p class="first-name">关于我们</p>
				<p class="first-name">回到顶部</p>
				<p class="first-name">网站地图</p>
			</div>
			<div id="cooperator-list">
				<aside>合作伙伴： </aside>
				<p class="cooperator">网上超市</p>
				<p class="cooperator">美逊商城</p>
				<p class="cooperator">华为商城</p>
				<p class="cooperator">小米官网</p>
				<p class="cooperator">苹果官网</p>
				<p class="cooperator">超廉价团购网</p>
				<p class="cooperator">第一折扣网</p>
				<p class="cooperator">点读笔厂家</p>
				<p class="cooperator">乐电</p>
				<p class="cooperator">九块邮官网</p>
				<p class="cooperator">美逊微博</p>
				<p class="cooperator">微信公众号：</p>
				<p class="cooperator">美逊商城</p>
				<p class="cooperator">掌上明珠家具</p>
			</div>
			<div id="img-icon">
				<img src="images/cont/FootImgInfo.png">
				<img src="images/cont/FootImgInfo1.png">
			</div>
			<div id="bianhao">
				编号： 鲁ICP备13025849号-1  美逊版权所有  邮箱：mayzone360@163.com 
			</div>
		</footer>
		
		
	</body>
	<script src="js/jquery.min.js"></script>
	<script src="js/jquery-ui.js"></script>
	<script src="js/jquery.cookie.js"></script>
	<script src="js/tradeDetail.js"></script>
</html>
